<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>

<meta name="robots" content="noindex, nofollow" />
<link rel="shortcut icon" href="${pageContext.request.contextPath}/images/favicon.ico" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/css/reset.css" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/css/styles.css" />
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/plugin/css/jquery-ui.css" />

<script language="javascript" type="text/javascript"
	src="${pageContext.request.contextPath}/js/overview.js"></script>
<script language="javascript" type="text/javascript"
	src="${pageContext.request.contextPath}/js/common.js"></script>

<script language="javascript" type="text/javascript"
	src="${pageContext.request.contextPath}/js/jquery-1.9.0.min.js"></script>
<script language="javascript" type="text/javascript"
	src="${pageContext.request.contextPath}/plugin/js/jquery-ui.js"></script>
<script language="javascript" type="text/javascript"
	src="${pageContext.request.contextPath}/plugin/js/nicEdit.js"></script>
<script type="text/javascript">
    //bkLib.onDomLoaded(function() { nicEditors.allTextAreas() });
	bkLib.onDomLoaded(function() {
	new nicEditor({fullPanel : true}).panelInstance('overview');
	new nicEditor({fullPanel : true}).panelInstance('objective');
	new nicEditor({fullPanel : true}).panelInstance('preRequisite');
	new nicEditor({fullPanel : true}).panelInstance('audience');
});
</script>

<script type="text/javascript">

	  function executeAndSubmit(){	    
		document.getElementById("objective").value = new nicEditors.findEditor('objective').getContent();
		document.getElementById("preRequisite").value = new nicEditors.findEditor('preRequisite').getContent();
		document.getElementById("overview").value = new nicEditors.findEditor('overview').getContent();
		document.getElementById("audience").value = new nicEditors.findEditor('audience').getContent();
       
	    document.forms[1].submit();
	}
	
</script>

<form:form action="${pageContext.request.contextPath}/usr/course" commandName="createCourseOverviewForm"
	method="POST" id="createCourseOverviewForm">
	
	<form:hidden path="action" />
    <form:hidden path="courseId" />	

	<div class="right-area">
		<div class="left-arrow">
			<img src="${pageContext.request.contextPath}/images/arrow-left.png"
				width="11" height="16" alt="" />
		</div>
		<div class="container">
			<div class="content forms">

				<form id="requester-course" name="requester_course" method="post">
					<div class="three-column-work-area">
						<table class="steps" cellpadding="0" cellspacing="0" width="100%">
							<tr>
								<td width="29%" class="active"><div class="num">1</div>
									Overview &gt;&gt;</td>
								<td width="47%"><div class="num">2</div> Agenda &amp;
									Trainer Details &gt;&gt;</td>
								<td width="24%"><div class="num">3</div> Schedule</td>
							</tr>
						</table>
						<h1>Overview</h1>
						<div class="forms-fields">
							<div class="input">
								<label>Course Title:</label>								
								<form:input path="courseTitle" id="courseTitle"/>
               			        <span class="errortxt"><form:errors path="courseTitle" /></span>
							</div>
							<div class="input">
								<label>Category:</label>								
								<form:select path="category" id="sub_group">
									<form:options items="${categoryMap}" />
								</form:select>
								<span class="errortxt"><form:errors path="category" /></span>
							</div>							
							<div class="input">
								<label>Course Level:</label>								 
								 <form:radiobutton path="courseLevel" value="1" /> <span>Beginner</span>
                				 <form:radiobutton path="courseLevel" value="2" /> <span>Intermediate</span>
               					 <form:radiobutton path="courseLevel" value="3" /> <span>Advanced</span> 
							</div>		
							<div class="input">
								<label>Tagged Skills:</label>								
								<form:input path="taggedSkills" id="taggedSkills"/>
               			        <span class="errortxt"><form:errors path="taggedSkills" /></span>
							</div>					
							<div class="input noflow">
								<label>Course Overview:</label>
								<div class="txtarea">									
									<form:textarea path="overview" id="overview" cols="80" rows="9" title="area1"/>
            						<span class="errortxt"><form:errors path="overview" /></span>
								</div>
								<div class="see-examples">
									<a href="javascript:void(0);"
										title="Are you looking for any of these features?">see
										examples</a>
									<div class="questionmark">
										<img src="images/arrow-bottom.png" width="16" height="11"
											alt="" />
										<div class="qustiontype">
											<h4>Account Type</h4>
											<p>
												<b>Trainer</b><br />Lorem Ipsum is simply dummy text of the
												printing and typesetting industry. Lorem Ipsum is simply
												dummy text of the printing and typesetting industry. Lorem
												Ipsum is simply dummy text of the printing and typesetting
												industry.
											</p>
											<p>
												<b>Trainee</b><br />Lorem Ipsum is simply dummy text of the
												printing and typesetting industry. Lorem Ipsum is simply
												dummy text of the printing and typesetting industry. Lorem
												Ipsum is simply dummy text of the printing and typesetting
												industry.
											</p>
										</div>
									</div>
								</div>
							</div>
							<div class="input">
								<label>Course Objective:</label>
								<div class="txtarea">
									<form:textarea path="objective" id="objective" cols="80" rows="9" title="area1"/>
            						<span class="errortxt"><form:errors path="objective" /></span>
								</div>
							</div>
							<div class="input">
								<label>Pre-Requisite:</label>
								<div class="txtarea">									
									<form:textarea path="preRequisite" id="preRequisite" cols="80" rows="9" title="area1"/>
            						<span class="errortxt"><form:errors path="preRequisite" /></span>
								</div>
							</div>
							<div class="input">
								<label>Target Audience:</label>
								<div class="txtarea">									
									<form:textarea path="audience" id="audience" cols="80" rows="9" title="area1"/>
            						<span class="errortxt"><form:errors path="audience" /></span>
								</div>
							</div>
							<div class="submit">
								<a href="javascript:executeAndSubmit()" class="btn next">Next
									&gt;&gt;</a>
							</div>
						</div>
					</div>
				</form>
			</div>
		</div>
		<div class="banner">
			<img src="${pageContext.request.contextPath}/images/ShakeOut_BannerAds_GetReady_160x600_v8.gif"
				width="161" height="600" alt="" />
		</div>
	</div>
	<!-- Right Area -->


</form:form>